<%@ page language="java" import="java.util.*" pageEncoding="utf-8"
	isELIgnored="false"%>
<!DOCTYPE html>
<html>
<head>
<title>CMS Login</title>

<link rel="stylesheet" href="assets/vendor/bootstrap/css/bootstrap.css" />
<link rel="stylesheet" href="assets/dist/css/bootstrapValidator.css" />
<link rel="stylesheet" href="assets/datetimepicker/css/bootstrap-datetimepicker.min.css" />
<script type="text/javascript"
	src="assets/vendor/jquery/jquery-1.10.2.min.js"></script>
<script type="text/javascript"
	src="assets/vendor/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript"
	src="assets/dist/js/bootstrapValidator.js"></script>
<script type="text/javascript"
	src="assets/datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
	<script type="text/javascript"
	src="assets/datetimepicker/js/locales/bootstrap-datetimepicker.fr.js"></script>
</head>
<body>
	<div class="container">
		<div class="row">
			<!-- form: -->
			<section>
				<div class="page-header text-center">
					<h1>欢迎注册</h1>
				</div>

				<div class="col-lg-8 col-lg-offset-2">
					<form id="defaultForm" method="post"
						action="${pageContext.request.contextPath }/ordinary/RegiserOrdinaryServlet.do"
						class="form-horizontal">
					
							<div class="form-group">
								<label class="col-lg-3 control-label" id="userName"
									onblur="test();" onblur="test();">用户名：</label>
								<div class="col-lg-5">
									<input type="text" class="form-control" name="username"
										 />
								</div>
							</div>



							<div class="form-group">
								<label class="col-lg-3 control-label">密码：</label>
								<div class="col-lg-5">
									<input type="password" class="form-control" name="password"
										 />
								</div>
							</div>

							<div class="form-group">
								<label class="col-lg-3 control-label">重复密码：</label>
								<div class="col-lg-5">
									<input type="password" class="form-control"
										name="confirmPassword" />
								</div>
							</div>

						
						
							<div class="form-group">
								<label class="col-lg-3 control-label">姓名：</label>
								<div class="col-lg-5">
									<input type="text" class="form-control" name="name"
										 />
								</div>
							</div>

							<div class="form-group">
								<label class="col-lg-3 control-label">邮箱地址：</label>
								<div class="col-lg-5">
									<input type="text" class="form-control" name="email"
										placeholder="" />
								</div>
							</div>



							<div class="form-group">
								<label class="col-lg-3 control-label">电话：</label>
								<div class="col-lg-5">
									<input type="text" class="form-control" name="phoneNumber"
										/>
								</div>
							</div>

							<div class="form-group">
								<label class="col-lg-3 control-label">出生日期：</label>
								<div class="controls input-append date form_date col-lg-5" data-date=""
									data-date-format="yyyy-mm-dd" data-link-field="dtp_input2"
									data-link-format="yyyy-mm-dd">
									<input  class="form-control" type="text" value="" readonly> <span
										class="add-on"><i class="icon-remove"></i></span> <span
										class="add-on"><i class="icon-th"></i></span>
								</div>
								<input type="hidden" id="dtp_input2" value="" /><br />
							</div>

							<div class="form-group">
								<div class="col-lg-2 col-lg-offset-4">
									<button type="submit" class="btn btn-primary btn-sm btn-block">注册</button>
								</div>
							</div>
					</form>
				</div>
			</section>
			<!-- :form -->
		</div>
	</div>

	<script type="text/javascript">
		$('.form_datetime').datetimepicker({
			//language:  'fr',
			weekStart : 1,
			todayBtn : 1,
			autoclose : 1,
			todayHighlight : 1,
			startView : 2,
			forceParse : 0,
			showMeridian : 1
		});
		$('.form_date').datetimepicker({
			language : 'fr',
			weekStart : 1,
			todayBtn : 1,
			autoclose : 1,
			todayHighlight : 1,
			startView : 2,
			minView : 2,
			forceParse : 0
		});
		$('.form_time').datetimepicker({
			language : 'fr',
			weekStart : 1,
			todayBtn : 1,
			autoclose : 1,
			todayHighlight : 1,
			startView : 1,
			minView : 0,
			maxView : 1,
			forceParse : 0
		});
	</script>
	<script type="text/javascript">
		$(document)
				.ready(
						function() {
							$('#defaultForm')
									.bootstrapValidator(
											{
												message : 'This value is not valid',
												feedbackIcons : {
													valid : 'glyphicon glyphicon-ok',
													invalid : 'glyphicon glyphicon-remove',
													validating : 'glyphicon glyphicon-refresh'
												},
												fields : {
													username : {
														validators : {
															notEmpty : {
																message : '不能为空'
															},
															stringLength : {
																message : '用户名必须为3-11位',
																min : 3,
																max : 11,

															},
															remote : {
																url : "ordinary/OrdinaryRegisterAjaxServlet.do",//UserAjaxSer
																type : "Post",
																message : "用户名已存在",

																data : {
																	username : function() {
																		return $(
																				"#userName")
																				.val();
																	},

																}
															}

														}
													},

													acceptTerms : {
														validators : {
															notEmpty : {
																message : '接受项目条款后方可注册'
															}
														}
													},
													name : {
														validators : {
															notEmpty : {
																message : '不能为空'
															}
														}
													},
													email : {
														validators : {
															notEmpty : {
																message : '不能为空'
															},
															emailAddress : {
																message : '请输入正确的邮箱地址'
															}
														}
													},
													phoneNumber : {
														validators : {
															stringLength : {
																min : 11,
																max : 11,
																message : '请输入合法的电话号码'
															},
														}
													},

													password : {
														validators : {
															notEmpty : {
																message : '不能为空'
															},
															identical : {
																field : 'confirmPassword',
																message : '两次密码输入不一致'
															}
														}
													},
													confirmPassword : {
														validators : {
															notEmpty : {
																message : '不能为空'
															},
															identical : {
																field : 'password',
																message : '两次密码输入不一致'
															}
														}
													},
												}
											});
						});
	</script>
</body>
</html>